<!--虚拟分组-->
<template>
  <div>
    <el-input
      placeholder="请输入组名称进行过滤"
      v-model="searchForm.groupName" class="mb10" clearable>
    </el-input>
    <el-table
      ref="tableRef"
      height="calc(100vh - 395px)"
      highlight-current-row
      :data="tableDataGroupFilter"
      v-loading="groupTableLoading"
      tooltip-effect="dark"
      row-key="id"
      key="second"
      border
      @selection-change="handleSelectionChange">
      <el-table-column
        type="selection"
        header-align="center"
        align="center"
        width="55">
      </el-table-column>
      <el-table-column
        prop="groupName"
        label="组名称"
        show-overflow-tooltip
      >
      </el-table-column>
      <el-table-column
        prop="groupRatio"
        label="组系数"
        width="70"
        align="center"
        show-overflow-tooltip
      >
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {getGroupList, userDeleteBatch} from "@/api/bonus/calculateorgconfig";
export default {
  name: "index",
  components:{
  },
  computed: {
    tableDataGroupFilter() {
      return  this.tableDataGroup.filter((data) => {
        return !this.searchForm.groupName || data.groupName.includes(this.searchForm.groupName)
      })
    }
  },
  data(){
    return{
      groupTableLoading:false,
      searchForm:{groupName:''},
      tableDataGroup:[],
      multipleSelection:[],
    }
  },
  created(){

  },
  mounted() {
  },
  methods: {
    groupOnLoad(data){
      this.parentTableData = data ;
      this.groupTableLoading = true ;
      getGroupList().then(res=>{
        if (res.data.code == 0){
          this.tableDataGroup = res.data.data
          //勾选回显
          this.$nextTick(()=>{
            this.selectedRows() ;
          })
        }else{
          this.$message.error('获取虚拟分组列表失败')
        }
        this.groupTableLoading = false ;
      }).catch(err=>{
        this.groupTableLoading = false ;
      })
    },
    selectedRows() {
      let selectedIds = this.parentTableData.map(item=>{
        return item.bonusDeptId + '' ; //与要对比的虚拟组，统一类型
      })
      this.tableDataGroup.map(item=>{
        if (selectedIds.includes(item.id)){
          this.$refs.tableRef.toggleRowSelection(item,true)
        }
      })
    },
    handleSelectionChange(list){
      this.multipleSelection = list ;
      this.$emit('selectGroup',list)
    },
    clearSelection(){
      this.multipleSelection = [] ;
      this.$refs.tableRef.clearSelection() ;
    }

  }
}
</script>

<style scoped>

</style>
